<!doctype html>
<html class="no-js">
<head>
	<!-- 公共head Begin -->
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="keywords" content="萌宠集市-C2B2C社会化电商平台" />
	<meta name="description" content="《萌宠集市-C2B2C社会化电商平台》是一个基于宠物社区的一站式电商平台。" />
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1.0, maximum-scale=1.0">

	<title>萌宠集市-C2B2C一站式电商平台->运营后台</title>

	<!-- Set render engine for 360 browser -->
	<meta name="renderer" content="webkit">

	<!-- No Baidu Siteapp-->
	<meta http-equiv="Cache-Control" content="no-siteapp"/>

	<link rel="icon" type="image/png" href="../statics/img/favicon.png">

	<!-- Add to homescreen for Chrome on Android -->
	<meta name="mobile-web-app-capable" content="yes">
	<link rel="icon" sizes="192x192" href="../statics/img/app-icon72x72@2x.png">

	<!-- Add to homescreen for Safari on iOS -->
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="apple-mobile-web-app-title" content="Pet Mall"/>
	<link rel="apple-touch-icon-precomposed" href="../statics/img/app-icon72x72@2x.png">

	<!-- Tile icon for Win8 (144x144 + tile color) -->
	<meta name="msapplication-TileImage" content="../statics/img/app-icon72x72@2x.png">
	<meta name="msapplication-TileColor" content="#0e90d2">

	<link rel="stylesheet" href="../statics/AmazeUI/assets/css/amazeui.min.css">
	<link rel="stylesheet" href="../statics/AmazeUI/assets/css/admin.css">
	<link rel="stylesheet" href="../statics/AmazeUI/assets/css/app.css">

	<!--[if (gte IE 9)|!(IE)]><!-->
	<script src="../statics/AmazeUI/assets/js/jquery.min.js"></script>
	<!--<![endif]-->
	<script src="../statics/AmazeUI/assets/js/amazeui.min.js"></script>
	<script src="../statics/AmazeUI/assets/js/amazeui.modal.js"></script>
	<!-- 百度编辑器
    <script type="text/javascript" charset="utf-8" src="../statics/UEditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="../statics/UEditor/ueditor.all.min.js"></script>
    <script type="text/javascript" charset="utf-8" src="../statics/UEditor/lang/zh-cn/zh-cn.js"></script>
    <script type="text/javascript">
        var ue = UE.getEditor('editor',{
                initialFrameWidth:"100%" //初始化选项
                //scaleEnabled:true//scaleEnabled {Boolean} [默认值：false] //是否可以拉伸长高，默认true(当开启时，自动长高失效)
            }
        );
    </script>
     -->
	<script src="../statics/AmazeUI/assets/js/validator.js"></script>
	<script src="../statics/js/plugin/jquery.livequery.js"></script>
	<!-- 此处form的导入和amazeui.min.js会有冲突，请根据需要使用
    <script src="statics/js/plugin/jquery.form.js"></script>
     -->
	<!--
    <script>
        $().ready( function() {
            AMUI.plugin('mySelected', AMUI.selected);
            $('[data-am-selected]').mySelected({btnWidth: '100%', maxHeight: '200px', btnSize: 'sm', btnStyle: 'secondary'});
        });
    </script>
        -->
	<script src="../statics/js/plugin/jquery.metadata.js"></script>
	<script src="../statics/js/plugin/jqPaginator.min.js"></script>
	<script src="../statics/js/base.js"></script>
	<script src="../statics/js/jquery.lSelect.js"></script>
	<!-- 公共head End -->
</head>
<body>
<!-- content start -->
<div class="admin-content">
  <div class="admin-content-body">
    <div class="am-cf app-padding-title">
      <div class="am-fl am-cf">
        <strong class="am-text-primary am-text-lg">订单管理</strong> / <small>查看订单</small>
      </div>
    </div>

    <hr data-am-widget="divider" class="am-divider am-divider-dashed am-margin-0" />
    
    <div class="am-tabs am-margin" data-am-tabs="{noSwipe: 1}">
      <ul class="am-tabs-nav am-nav am-nav-tabs">
        <li class="am-active"><a href="#tab1">订单信息</a></li>
        <li><a href="#tab2">商品信息</a></li>
	    <li><a href="#tab3">付款记录</a></li>
      </ul>

      <div class="am-tabs-bd">
        <div class="am-tab-panel am-fade am-in am-active" id="tab1">
          <div class="am-g am-u-sm-12">
			  <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">订单状态</div>
			  <div class="am-u-sm-8 am-u-md-10"><p class="am-badge" id="lblStatus">-</p></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">订单编号</div>
  		    <div class="am-u-sm-8 am-u-md-4"><p id="lblOrderNo">-</p></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">下单时间</div>
  		    <div class="am-u-sm-8 am-u-md-4"><p><small id="lblCreateTime">-</small></p></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">商品总金额</div>
  		    <div class="am-u-sm-8 am-u-md-4"><p class="am-text-danger" id="lblProductPriceAmount">-</p></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">配送方式</div>
  		    <div class="am-u-sm-8 am-u-md-4"><small>科泰宠物托运中心</small></div>
            <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">配送费用</div>
		    <div class="am-u-sm-8 am-u-md-4"><strong class="am-text-warning">￥12</strong></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">订单总金额</div>
  		    <div class="am-u-sm-8 am-u-md-10"><strong id="lblPayment" class="am-text-danger">-</strong></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">附言</div>
            <div class="am-u-sm-8 am-u-md-10"><p id="lblRemark">-</p></div>
              
  		    <hr data-am-widget="divider" class="am-divider am-divider-dotted" />
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">收货人姓名</div>
  		    <div class="am-u-sm-8 am-u-md-4"><p id="lblShipName">-</p></div>
		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">联系电话</div>
		    <div class="am-u-sm-8 am-u-md-4"><p id="lblShipPhone">-</p></div>
		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">收货地址</div>
		    <div class="am-u-sm-8 am-u-md-4"><p id="lblShipAddress">-</p></div>
  		    <div class="am-u-sm-4 am-u-md-2 am-text-right am-kai am-padding-horizontal-0">邮编</div>
  		    <div class="am-u-sm-8 am-u-md-4"><p id="lblShipZipCode">-</p></div>
          </div>
        </div>
  
        <div class="am-tab-panel am-fade" id="tab2">
          <div class="am-g am-u-sm-12 am-padding-0 am-margin-0">
            <div class="am-scrollable-horizontal">
        	  <!-- 商品信息 -->
  		      <table id="tblOrderDetailList" class="am-table am-table-striped am-table-hover table-main am-text-nowrap">
      		    <thead>
      		      <tr>
					  <th>商品名称</th>
					  <th>商品分类</th>
					  <th>卖家</th>
					  <th>购买价格</th>
					  <th>购买数量</th>
					  <th>小计</th>
					  <th>状态</th>
					  <th>操作</th>
      		      </tr>
      		    </thead>
      		    <tbody>
      		    </tbody>
      		  </table>
            </div>
          </div>
        </div>

		  <div class="am-tab-panel am-fade" id="tab3">
			  <div class="am-g am-u-sm-12 am-padding-0 am-margin-0">
				  <div class="am-scrollable-horizontal">
					  <!-- 收款记录 -->
					  <table id="tblPayList" class="am-table am-table-striped am-table-hover table-main am-text-nowrap">
						  <thead>
						  <tr>
							  <th class="am-kai">支付编号</th>
							  <th class="am-kai">支付方式</th>
							  <th class="am-kai">支付金额</th>
							  <th class="am-kai">付款用户</th>
							  <th class="am-kai">支付时间</th>
						  </tr>
						  </thead>
						  <tbody>
						  </tbody>
					  </table>
					  <div id="noData" style="display: none;" class="am-kai am-text-sm am-text-center am-margin">
						  <h3>没有找到任何记录!</h3>
					  </div>
				  </div>
			  </div>
		  </div>
  
      </div>
    </div>
    <div class="am-margin">
      <button type="button" class="am-btn am-btn-default" onclick="window.history.back(); return false;"><span class="am-icon-undo">  返  回</span></button>
    </div>
  </div>
</div>
<!-- content end -->
</body>
<script>

    // '订单明细'列表
    let orderDetailList = new Array();

    // 商品分类列表
    let categoryList = new Array();

    // ‘支付’列表
	let payList = new Array();

    let jsonUser;
    let token;

    // 订单id
    let orderId = GetQueryString('id');

    $().ready(function() {

        // 判断用户信息和token是否存在
        jsonUser = sessionStorage.getItem("admin");
        token = sessionStorage.getItem("token");

        if(!jsonUser || !token) {
            top.location.href = 'admin_login.html';
            return;
        }

        // 判断当前页面是否在框架页中，如果不存在，就跳转到后台中心页面
        if(self.location == top.location)
            location.href='admin_center.html';


        // 查看是否存在订单id
        if( orderId ) {
            // 加载'商品分类'列表
            loadCategoryList();

            // 如果存在订单id，就加载订单信息
            loadOrderInfo();

            // 加载'订单明细'列表数据
            loadOrderDetailList();

            // 加载'付款记录'列表数据
            loadPayList();
        }

    });// $().ready(function());

/**	加载'商品分类'列表数据 **/
function loadCategoryList() {

	// 加载'商品分类'数据
	$.ajax({
		type: 'POST',
		url: 'http://localhost:8080/category/getAll',
		async: false,
		success: function (result) {

			// 如果返回的数据的响应码不是'成功(200)'
			if (result.code != 200) {
				Modal.alert(result.msg);
				return;
			}

			// 如果返回的数据响应码为200
			// 就进行表格数据填充
			categoryList = result.data;

		}// success();

	});// $.post();

}// loadCategoryList();

/**	加载'订单明细'列表数据 **/
function loadOrderDetailList() {

	// 加载'商品列表'数据
	$.post('http://localhost:8080/order/detail/list',
		{
			token: token,
			orderId: orderId

		}, function (result) {

			// 如果返回的数据响应码为200
			// 就进行表格数据填充
			orderDetailList = result.data;

			// 填充表格数据
			fillOrderDetailList();

		});// $.post();

}// loadOrderDetailList();

/** 填充表格数据 **/
function fillOrderDetailList( ) {

	// 清空表格数据
	$('#tblOrderDetailList tbody').empty();

	// 如果没有集合数据，就直接返回
	if( !orderDetailList || orderDetailList.length == 0 ){
		return;
	}// if();

	// 商品总数量
	let quantityAmount = 0;
	// 商品总金额
	let priceAmount = 0;

	// 循环构造单元格数据，并进行填充
	for( let i = 0; i < orderDetailList.length; i++ ) {

		let orderDetail = orderDetailList[i];

		// 商品名称
		let tdName = '<td class="productName"><a target="_blank" href="../product_content.html?id='
			+ orderDetail.productId + '&cid=' + orderDetail.categoryId + '">'
			+ orderDetail.productName + '</a></td>';

		// 商品分类
		let tdCategory = '<td>' + getCategoryPath(orderDetail.categoryId) + '</td>';

        // 卖家
        let tdSellerName = '<td><strong class="am-text-truncate">'
            + '<a target="_blank" href="../seller_item_list.html?id=' + orderDetail.sellerId
            + '">' + orderDetail.sellerUsername + '</a></strong></td>';

		// 购买价格
		let tdPrice = '<td>' + priceCurrencyFormat(orderDetail.unitPrice) + '</td>';

		// 购买数量
		let tdQuantity = '<td><span class="storeInfo">' + orderDetail.quantity + '</span></td>';

		// 小计
		let tdSubTotal = '<td class="am-text-middle"><span class="subtotalPrice am-text-danger">' + priceCurrencyFormat(orderDetail.totalPrice)  + '</span></td>';

		// 发货状态
		let tdSendStatus = '<td><strong class="am-text-warning"> ' + ORDER_SEND_STATUS[orderDetail.sendStatus] + '</strong></td>';
		// 如果‘发货状态’为‘已发货’
		if( orderDetail.sendStatus == ORDER_SEND_STATUS_CONST.SEND ) {
            tdSendStatus = '<td><strong class="am-text-success"> ' + ORDER_SEND_STATUS[orderDetail.sendStatus] + '</strong></td>';
		}

        // 操作
        let tdOpt = '<td><div class="am-btn-group am-btn-group-xs">';

        // '发货'按钮
        let btnShipping = '<button type="button" class="am-btn am-btn-default am-btn-xs am-text-success " onclick="sendShipping(\'' + orderDetail.id +'\')">'
            + '<strong class="am-icon-paper-plane"> 发货</strong></button>';

        // 操作封装
        // 判断当前订单状态是否为'未发货'
        if( orderDetail.sendStatus == ORDER_SEND_STATUS_CONST.UN_SEND ) {
            // 显示'全部发货'按钮
            tdOpt += btnShipping;
        }

        tdOpt += '</div></td>';

		// 将构造好的单元格数据，填充到表格中
		$('#tblOrderDetailList tbody').append('<tr>' + tdName + tdCategory + tdSellerName + tdPrice + tdQuantity + tdSubTotal + tdSendStatus + tdOpt + '</tr>');

	}// for();

}// fillOrderDetailList();

/** 根据订单id，查找订单信息 **/
function loadOrderInfo(){

	// 加载'商品信息'数据
	$.ajax({
		type: 'POST',
		url: 'http://localhost:8080/order/get',
		async: false,
		data: {
			token: token,
			id:orderId
		},
		success: function (result) {

			// 如果返回的是token失效，就重新登录
			if (result.code == 419) {

				Modal.confirm('当前会话token失效，请重新登录页面！', {
					closeViaDimmer: false,
					onConfirm: function() {
						top.location.href = 'admin_login.html';
					},
					onCancel: function() {
						top.location.href = 'admin_login.html';
					}
				});// Modal.confirm();

				return;
			}

			// 如果返回的数据的响应码不是'成功(200)'
			if (result.code != 200) {
				Modal.alert(result.msg);
				return;
			}

			// 如果返回的数据响应码为200
			// 填充订单信息数据
			fillOrderInfo(result.data);
		}

	});// $.ajax();

}// loadOrderInfo();

/** 填充订单信息 **/
function fillOrderInfo( order ) {

	// 订单编号
	$('#lblOrderNo').html(order.orderNo);
	// 下单时间
	$('#lblCreateTime').html(order.createTime);
	// 商品总金额
	$('#lblProductPriceAmount').html(priceCurrencyFormat(order.productPriceAmount));
	// 订单总金额
	$('#lblPayment').html(priceCurrencyFormat(order.payment));
    // 附言
    $('#lblRemark').html(order.remark);


	// 订单状态
	$('#lblStatus').html(ORDER_STATUS[order.status]);
    $('#lblStatus').addClass(ORDER_STATUS_ICON[order.status]);

	// 收货人姓名
	$('#lblShipName').html(order.shippingName);
	// 收货地址
	$('#lblShipAddress').html(order.shippingAddress);
	// 收货人手机号码
	$('#lblShipPhone').html(order.shippingPhone);
	// 收货人邮编
	$('#lblShipZipCode').html(order.shippingZipCode);


}// fillOrderInfo( order );

/**	加载'付款记录'列表数据 **/
function loadPayList() {

	// 加载'付款列表'数据
	$.post('http://localhost:8080/pay/list',
		{
			token: token,
			orderId: orderId

		}, function (result) {

			// 如果返回的数据响应码为200
			// 就进行表格数据填充
			payList = result.data;

			// 填充表格数据
			fillPayList();

		});// $.post();

}// loadPayList();

/** 填充表格数据 **/
function fillPayList( ) {

	// 清空表格数据
	$('#tblPayList tbody').empty();
    // 隐藏显示提示
    $('#noData').hide();

	// 如果没有集合数据，就直接返回
	if( !payList || payList.length == 0 ){
        // 设置没有数据提示
        $('#noData').show();
		return;
	}// if();

	// 循环构造单元格数据，并进行填充
	for( let i = 0; i < payList.length; i++ ) {

		let pay = payList[i];

		// 支付编号
		let tdPayNo = '<td><span class="am-text-primary">' + pay.payNo + '</span></td>';

		// 支付方式
		let tdPayType = '<td>支付宝</td>';

		// 支付金额
		let tdPrice = '<td><strong class="am-text-success">'
						+ priceCurrencyFormat(pay.platformTradeAmount) + '</strong></td>';

		// 付款用户
		let tdUsername = '<td><strong class="am-text-danger">' + pay.username + '</strong></td>';

		// 支付时间
		let tdPaymentTime = '<td>' + pay.platformPaymentTime  + '</td>';

		// 将构造好的单元格数据，填充到表格中
		$('#tblPayList tbody').append('<tr>' + tdPayNo + tdPayType + tdPrice + tdUsername + tdPaymentTime + '</tr>');

	}// for();

}// fillPayList();

/** 子订单发货 **/
function sendShipping( orderDetailId ) {

	Modal.register(['confirm','alert']);
	Modal.confirm("您确定要发货吗？",{
		relatedTarget: this,
		onConfirm: function(options) {
			$.ajax({
				type: 'POST',
				url: 'http://localhost:8080/order/detail/send',
				dataType: "json",
				async: false,
				data: { token: token, orderDetailId: orderDetailId},
				success: function( result ) {

					// 如果返回的数据的响应码不是'成功(200)'
					if (result.code != 200) {
						Modal.alert(result.msg);
						return;
					}

					// 如果返回的数据响应码为200
					Modal.alert('发货成功！');

					// 重新加载订单列表
                    loadOrderInfo();

                    // 加载'订单明细'列表数据
                    loadOrderDetailList();

				}// success: function( result );
			});
		}// onConfirm: function(options);
	});
}// sendShipping( orderDetailId );

/** 根据商品分类id，获取商品分类路径信息 **/
function getCategoryPath( categoryId ) {

	// 分类路径
	let categoryPath = "";

	// 父分类id
	let parentCategoryId;

	// 子分类名称
	let childCategoryName;

	// 循环查找父分类id
	for( let i = 0; i < categoryList.length; i++ ) {

		let category = categoryList[i];

		// 如果当前分类的id，等于传入的分类id
		if( category.id == categoryId ){
			// 设置父分类id
			parentCategoryId = category.parentId;
			// 设置子分类名称
			childCategoryName = category.name;
			break;
		}

	}// for();

	// 循环查找父分类名称
	for( let i = 0; i < categoryList.length; i++ ) {

		let category = categoryList[i];

		// 如果当前分类的父id，等于找到的父分类id
		if( category.id == parentCategoryId ){
			// 设置当前父分类名称路径
			categoryPath = category.name + '&nbsp;->&nbsp;' + childCategoryName;
			break;
		}

	}// for();

	return categoryPath;


}// getCategoryPath( categoryId );
</script>
</html>
